<template>
  <div>
    <el-container style="position: absolute;left: 0;top: 0;bottom: 0;right: 0;overflow: hidden;background: rgb(243, 243, 243);">
      <el-header style="height: 70px;background: #7A5FF7;">
        <img src="../img/renshiyunlog.png" style="cursor: pointer; margin-top: 22px;" @click="goTo('/home')">
        <div class="text-hearder">
          <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" style="margin-top:14px;width: 20px;height: 20px;"></el-avatar>
          <span class="text-hearder-name">{{name}}</span>
          <!-- <p style="font-size: 12px;color: #D6CEEE;margin:0">{{gongsi}}</p> -->
          <el-dropdown>
            <span style="font-size: 12px;color: #D6CEEE;margin:0">{{gongsi}}
              <i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item @click.native="goTo('/ContentUser')">账号设置</el-dropdown-item>
              <el-dropdown-item @click.native="goback">退出</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </el-header>
      <el-container style="padding:20px 0 0 8px;background: #F3F3F3;">
        <el-aside width="220px">
          <div class="img-side" style="height: 94px;cursor: pointer" @click="goTo('/home')">
            <img src="../img/商社保logo.png" style="cursor: pointer;margin: 36px 0px 0px 44px;" @click="goTo('/ContentIndex')">
          </div>
          <el-row class="tac">
            <el-col :span="24">
              <el-menu :default-active="$route.path" class="el-menu-vertical-demo" background-color="#7A5FF7" active-text-color="#7A5FF7" text-color="#FFFFFFFF">
                <el-menu-item index="/home" @click.native="goTo('/home')">
                  <span slot="title" >首页</span>
                </el-menu-item>
                <el-menu-item index="/ContentPersonsInfo" route="/ContentPersonsInfo" @click="goTo('/ContentPersonsInfo')">
                  <span slot="title" >参保人</span>
                </el-menu-item>
                <el-submenu index="3">
                  <template slot="title">
                    <span>增减员</span>
                  </template>
                    <el-menu-item index="/addmember" @click.native="goTo('/addmember')">增员</el-menu-item>
                    <el-menu-item index="/delmember" @click.native="goTo('/delmember')">减员</el-menu-item>
                    <el-menu-item index="/adjustablebase" @click.native="goTo('/adjustablebase')">调基</el-menu-item>
                    <el-menu-item index="3-4">参保历史清单</el-menu-item>
                </el-submenu>
                <el-submenu index="4">
                  <template slot="title">
                    <span>理赔</span>
                  </template>
                    <el-menu-item index='/social' @click.native="goTo('/social')">社保理赔</el-menu-item>
                    <el-menu-item index="/commercial" @click.native="goTo('/commercial')">商保理赔</el-menu-item>
                </el-submenu>
                <el-submenu index="5" disabled>
                  <template slot="title">
                    <span>发薪</span>
                  </template>
                    <el-menu-item index="5-1">发薪管理</el-menu-item>
                    <el-menu-item index="5-2">历史发薪记录</el-menu-item>
                    <el-menu-item index="5-3">发薪报表</el-menu-item>
                </el-submenu>
                <el-menu-item index="6" disabled>
                  <span slot="title">订单</span>
                </el-menu-item>
                <el-submenu index="7" disabled>
                  <template slot="title">
                    <span>财务</span>
                  </template>
                    <el-menu-item index="7-1">账户信息</el-menu-item>
                    <el-menu-item index="7-2">转出</el-menu-item>
                    <el-menu-item index="7-3">充值</el-menu-item>
                    <el-menu-item index="7-4">开票管理</el-menu-item>
                </el-submenu>
                <el-menu-item index="8" disabled>
                  <span slot="title">授权</span>
                </el-menu-item>
                <el-menu-item index="9" disabled>
                  <span slot="title">员工</span>
                </el-menu-item>
              </el-menu>
            </el-col>
          </el-row>
        </el-aside>
        <el-main>
          <router-view v-if="isShowtext"></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
<script>
export default {
  name: 'Index',
  mounted(){
    this.getlist()

  },
  methods: {
    goTo: function (path) {
      if (this.$route.path !== path && this.$route.path !== null) {
        this.$router.push({ path: path })
      }
    },
    text: function () {
      this.$axios.post('http://172.16.1.105:7070/shangshebao/user', {
        params: {
          token: this.ssbToken
        }
      }).then(res => {
        console.log(res)
      }).catch(error => {
        console.log(error)
      })
    },
    getlist(){
      this.$axios.get('http://172.16.1.105:7070/shangshebao/user/getToken',{
          params: {
          userid: '123',
          rsy_token: 'erqweqw',
          username: '家电'
        }
      }).then(res => {
        this.ssbToken = res.data.data;
        if(res.data.code === 200){
          this.$axios.get('http://172.16.1.105:7070/shangshebao/getMenu',{
            headers: {
              token: this.ssbToken
            }
          }).then(res => {
            // console.log(res);
          }).catch(error => {
            // console.log(error)
          })
        }
      }).catch(error => {
        console.log(error)
      })
    },
    goback(){
      this.$axios.get('http://172.16.1.105:7070/shangshebao/loginOut',{
        headers:{
          token: this.ssbToken
        }
      }).then(res =>{
        console.log(res);
        alert("退出账号成功")
        window.location.href="http://www.baidu.com" // 暂时写死
      }).catch(error=>{
        alert("退出失败")
        console.log(res);
      })
    }
    

  },
  data: function () {
    return {
      sizeList: ['large'],
      ssbToken:'',
      name:'张三',
      gongsi:'广州正薪科技有限公司',
      isShowtext:true
    }
  }
}
</script>

<style scoped>
.el-aside {
  border-radius: 5px;
  max-height: 800px;
  background: #7A5FF7;
  box-shadow: 4px 4px 4px 0px rgba(197, 197, 197, 0.5);
  overflow: visible;
}

.el-main {
  color: #333;
  padding: 0;
  margin-left: 20px;
}

.el-icon-arrow-down {
  font-size: 12px;
}
.text-hearder{
  /* background: red; */
  width: 150px;
  height: 70px;
  float: right;
}
.text-hearder-name{
  font-size: 14px;
  color: #FFFFFF;

}
.el-menu-item.is-active {
   background-color: #FFFFFFFF !important;
}
.tac,
.el-row{
  width: 220px;
}
.el-menu-vertical-demo,
.el-menu{
  border: none;
}
</style>
